<template>
    <div class="alert-settings-container">
      <!-- Alarm Settings Section -->
      <div class="section">
        <h3>预警规则</h3>
        <div class="form-group">
          <label for="alert-time">预警提醒时间设置</label>
          <select v-model="alertTime" class="form-control">
            <option value="1">1日内</option>
            <option value="5">剩余5日</option>
          </select>
        </div>
  
        <div class="form-group">
          <label for="alert-close">预警临近时间设置</label>
          <select v-model="alertNear" class="form-control">
            <option value="3">临近预警3日</option>
          </select>
        </div>
      </div>
  
      <!-- Alert Notification Section -->
      <div class="section">
        <h3>预警提醒</h3>
        <div class="form-group">
          <label for="alert-accounts">提 醒 账 号</label>
          <select v-model="reminderAccount" class="form-control">
            <option value="1">管理员1 (13012345678)</option>
            <option value="2">管理员2 (13800000000)</option>
          </select>
        </div>
  
        <div class="form-group">
          <label for="alert-period">案件办结延期</label>
          <select v-model="delayPeriod" class="form-control">
            <option value="5">5日内</option>
          </select>
        </div>
      </div>
  
      <!-- Buttons -->
      <div class="buttons">
        <button @click="submitSettings" class="btn btn-primary">保存设置</button>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        alertTime: '1', // Default to 1 day
        alertNear: '3', // Default to 3 days
        reminderAccount: '1', // Default to first account
        delayPeriod: '5' // Default to 5 days
      };
    },
    methods: {
      submitSettings() {
        // Handle settings submission
        console.log("Settings Saved!");
      }
    }
  };
  </script>
  
  <style scoped>
  .alert-settings-container {
    padding: 20px;
  }
  
  .section {
    margin-bottom: 20px;
  }
  
  .form-group {
    margin-bottom: 10px;
  }
  
  label {
    font-weight: bold;
  }
  
  .select {
    width: 200px;
  }
  
  .buttons {
    margin-top: 20px;
  }
  
  .btn {
    padding: 10px 20px;
  }
  </style>
  